<template>
	<theme-box title=" 素材上传">
		<form class="form-horizontal" @submit.prevent v-el:form>
			<div class="box-body">
				
				<div class="row control-margin-form">
					<div class="col-sm-6">			  
					  <form-input  title="素材名称" :maxlength="12" :required=true name="name" left="3"></form-input>
					  <div class="divide col-sm-offset-3"></div>
						<form-group title="素材类型" left="3">
							<select class="form-control" name="mediaType">
								<option value="1">image</option>
							</select>
						</form-group>		
						<div class="divide col-sm-offset-3"></div>				
					</div>
					<div class="col-sm-6">		
						<form-group title="选择附件" left="3" :required=true>
							<file-upload v-ref:fileupload></file-upload>
						</form-group>		
						<div class="divide col-sm-offset-3"></div>					
						<form-input title="素材描述" name="dsc" left="3" :maxlength="30"></form-input>
						<div class="divide col-sm-offset-3"></div>
					</div>
				</div>

			</div>
			<!-- /.box-body -->
			<div class="box-footer">
				<v-button type="reset" @click="reset">重置</v-button>
				<v-button type="submit" theme="primary" class="pull-right">确认</v-button>
			</div>
			<!-- /.box-footer -->
		</form>
	</theme-box>
</template>

<script>
		
var serialize = require('form-serialize');
	
	export default {
		methods: {
			reset() {
				$("label.error").remove();
				this.$els.form.reset();				
			},			
			submit() {
			
				if(!(this.$refs.fileupload.$els.upload.value)){
					let data = {
						title:"操作提示",
						content:"请选择附件"
					}
					Midway.alert(data);
					return false;
				}							
				let formData = new FormData(this.$els.form);  
		    formData.append("type", "image");					 
				formData.append("mchtIdFlag",localStorage.getItem('get_id'))
        this.$postFormData({
          url: "/api/v1" + projectName_Url + "/wechat/media/upLoad.html",
					data: formData
        }).then(response=>{
					let message = {
						title: "操作提示",
						content: "操作成功"
					}
					Midway.alert(message);
				},error => {});       			
			}
		},
		ready() {
			let self = this;
			$(this.$els.form).submit(function () {
				return false;
			});						
			$(this.$els.form).validate({
				submitHandler: function () {
				  self.submit();
				},	
				rules: {		
					name: {
						required:true
					},
					file: {
						required: true
					}
				},
				messages: {
					name: {
						required:"素材名称不能为空"
					},
					file: {
						required: "请选择附件"
					}					
				},
				errorPlacement: function(error, element) {
						$(element).closest('.form-group').next().html(error)
				} 			
			});
		}
	}
</script>